<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/作业.css">
</head>

<body>
    <header>
        <img src="./images/logo.png" alt="" class="logo">
        <img src="./images/main-bg.png" alt="">
    </header>
    <nav>
        <ul>
            <li>home</li>
            <li>about</li>
            <li>services</li>
            <li>products</li>
            <li>contacts</li>
        </ul>
    </nav>
    <article>
        <img src="./images/slide-3.png" alt="">
        <a href="">READ MORE</a>
    </article>
    <section>
        <!-- 三个圆下面的图片 -->
        <div>
            <img src="./images/header-bg.png" alt="">
            <!-- 第一个圆 -->
            <div class="dygy">
                <p>^</p>
                <p>BUSINESS</p>
                <p>STRATEGY</p>
            </div>
            <!-- 第二个圆 -->
            <div class="degy">
                <p>MARKETING</p>
                <p>RESEARCH</p>
            </div>
            <div class="dsgy">
                <p>FINANCIAL &</p>
                <p>BANKING</p>
            </div>
        </div>
        <!-- 三个圆以后的文字 -->
        <div class="thwz">
            <!-- 标题 -->
            <div class="bt">
                <h1>Our experience is the base for </h1>
                <h1>your innovations.</h1>
            </div>
            <!-- ABCD四个框框 -->
            <div class="ABCD">
                <div class="A">
                    <h1>A.</h1>
                    <div class="dl">
                        <p>Vivamus hendrerit mauris ut dui gravida ut cicerra lectus tincidunt cras mattis.</p>
                        <a href="">READ MORE</a>
                    </div>
                </div>
                <div class="B">
                    <h1>B.</h1>
                    <div class="dl">
                        <p>Cras mattis tempor eros nec tristique sed sed felis arcu vel vehicula augue.</p>
                        <a href="">READ MORE</a>
                    </div>
                </div>

                <div class="C">
                    <h1>C.</h1>
                    <div class="dl">
                        <p>Sed sed felis arcu,vel vehicula maecenas fusce tincidunt.</p>
                        <a href="">READ MORE</a>
                    </div>
                </div>
                <div class="D">
                    <h1>D.</h1>
                    <div>
                        <p>Cras mattis tempor eros nec tristique, Sed sed felis arcu,vel vehicula augue. Maecenas
                            faucibus
                            cursus.Fusce tincidunt telius eget tristique.cursus.</p>
                        <a href="">READ MORE</a>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <aside>
        <!-- 标题框 -->
        <div class="welcome">
            <h1>Welcome to our company!</h1>
            <p> <a href="">Click here</a> for more info about this free website templates created by
                TemplateMonster.com.This websi tetemplate is optimized for 1280X1024 screen resolution.It is als0 XHTML
                & CSS valid. Vivamus hendrerit mauris ut dui gravida ut viverra lectus tincidunt Cras mattis tempor eros
                nec tristique.</p>
        </div>
        <!-- 三个人头像图片 -->
        <div class="srt">
            <!-- 第一张图 -->
            <div class="dyz">
                <img src="./images/page1-img1.jpg" alt="">
                <p>Sara Green</p>
                <span>MANAGER</span>
            </div>
            <!-- 第二张图 -->
            <div class="dez">
                <img src="./images/page1-img2.jpg" alt="">
                <p>Thom Smith</p>
                <span>MARKETOLOG</span>
            </div>
            <!-- 第三张图 -->
            <div class="dsz">
                <img src="./images/page1-img3.jpg" alt="">
                <p>April Black</p>
                <span>MANAGER</span>
            </div>
        </div>
        <!-- 右边文字 -->
        <div class="right">
            <!-- 右上文字 -->
            <div class="ys">
                <h1>Latest news:</h1>
                <h3>NOV.25.2012</h3>
                <p>The PSDSource files ofthis Pointtemplateb are available for free for the registered members of TemplateMonster.com.Feel free to get them!</p>
            </div>
            <!-- 右下文字 -->
            <div class="yx">
                <h3>NOV.23.2012</h3>
                <p>This website template has several pages; Home,About Services, Froducts, Contacts (note that contact us form-doesn'twork)</p>
                <a href="">READ MORE</a>
            </div>
        </div>
    </aside>
    <footer>
        <!-- 三段话 -->
        <div class="sdh">
            <div class="dyd">
                <h2>Services:</h2>
                <p>><a href="">MATTIS TEMPOR EROS NEC</a></p>
                <p>><a href="">TRISTIQUE SED SED FELS</a></p>
                <p>><a href="">ARCU VEL VEHICULAAUGUE</a></p>
                <p>><a href="">MAECENAS FAUCIBUS</a></p>
            </div>
            <div class="dyd">
                <h2>Services:</h2>
                <p>><a href="">MATTIS TEMPOR EROS NEC</a></p>
                <p>><a href="">TRISTIQUE SED SED FELS</a></p>
                <p>><a href="">ARCU VEL VEHICULAAUGUE</a></p>
                <p>><a href="">MAECENAS FAUCIBUS</a></p>
            </div>
            <div class="dyd">
                <h2>Services:</h2>
                <p>><a href="">MATTIS TEMPOR EROS NEC</a></p>
                <p>><a href="">TRISTIQUE SED SED FELS</a></p>
                <p>><a href="">ARCU VEL VEHICULAAUGUE</a></p>
                <p>><a href="">MAECENAS FAUCIBUS</a></p>
            </div>
        </div>
        <!-- 右边方框 -->
        <div class="you">
            <h2>Latest news:</h2>
            <div>
                <p><img src="./images/quote-before.png" alt="">Meamus hendrerit mauris ut dul gravida ut wiverra leclus tncidunt Cras malis lempor eros nectislique.Sed ssd felis arcu, well wehiculla augue.<img src="./images/quote-after.png" alt=""></p>
                <h4>April Black<span> (MANAGER)</span></h4>
            </div>
        </div>
    </footer>
    <!-- 最下面的内容 -->
    <div class="footer-logo">
        <img src="./images/footer-logo.png" alt="">
        <p>website Template designed by <a href="">TemplateMonster.com</a></p>
        <div class="youlogo">
            <img src="./images/social-link-1.jpg" alt="">
            <img src="./images/social-link-2.jpg" alt="">
            <img src="./images/social-link-3.jpg" alt="">
        </div>
    </div>
    <!-- 最下右边图片 -->
    
</body>

</html>